*{
    margin     : 0;
    padding    : 0;
    font-family: Helvetica, sans-serif, Arial
}

html, body{
    font-size: 10px;
}
/* 工具栏 */
#toolBar{
    z-index    : 999;
    position   : fixed;
    top        : 0;
    background : #3b5998;
    width      : 100%;
    padding    : .5rem;
    display    : flex;
    align-items: center;
    height     : 3.3rem;
    box-sizing : border-box;
}

#current-folder{
    color        : white;
    background   : rgba(0, 0, 0, 0.3);
    padding      : 0.5rem 1rem;
    min-width    : 10rem;
    border-radius: .2rem;
    height       : 1.5rem;
    text-align   : center;
    font-size    : 1.4rem;
    line-height  : 1.5rem;
    overflow     : hidden;
    text-overflow: ellipsis;
    direction    : rtl;
    text-align   : left;
    max-width    : 30rem;
}

#toolBar #search{
    height       : 2rem;
    width        : 15rem;
    border-radius: .8rem;
    position     : absolute;
    right        : 1rem;
    outline      : 0;
    border       : none;
    text-indent  : 1rem;
    padding-right: .6rem;
}

.navBtn{
    height      : 2rem;
    background  : transparent;
    border      : none;
    margin-right: 1rem;
}

.navBtnContainer{
    display    : flex;
    align-items: baseline;
    height     : 2rem;
    box-sizing : border-box;
}

.navBtn img{
    height: 2rem;
}

#main-area{
    position       : relative;
    top            : 3.3rem;
    display        : flex;
    flex-wrap      : wrap;
    align-content  : center;
    align-items    : baseline;
    justify-content: flex-start;
    padding        : 0 .5rem;
}

.fileItem{
    display        : flex;
    flex-direction : column;
    justify-content: center;
    align-items    : center;
    text-align     : center;
    width          : 16rem;
    height         : 20rem;
    margin         : .5rem 1rem;
    border-radius  : .5rem;
}

.fileItem .fileIcon{
    display: block;
    width  : 80%;
}

.fileItem .fileName{
    padding           : .3rem;
    border-radius     : .5rem;
    margin-top        : 1rem;
    max-width         : 80%;
    font-size         : 1.5rem;
    overflow          : hidden;
    text-overflow     : ellipsis;
    display           : -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.selected .fileIcon{
    background: #e6e6e6;
}

.selected .fileName{
    background: #1953E5;
    color     : white !important;
}